<%= javascript_include_tag 'cloud-zoom.js' %>

<div class="wrapper" style="position:relative;">
  <div id="div_more_content" style="position:absolute;z-index:999;right:-13px;top:700px;"><img src="http://wsstatic.mbaobao.com/v1/images/icon_page_more.gif" alt="" /></div>
  <!-- list_main start -->
  <a id="page_top"></a>
  <div class="page_main">
    <div class="left_box">
      <!-- 分类 start -->

      <!---->
      <div id="left_goods_category" class="catalog">
        <div><img src="http://wsstatic.mbaobao.com/v1/images/title_catalog.gif" width="181" height="22" alt="请选择分类" /></div>
         <%=nav_categories%>
      </div>			<!-- 分类 end -->

      <!-- 高级搜索 start -->
      <!--
			<div class="left_boxs">
				<h4>高级搜索</h4>
				<div class="adv_search_box">
					<form action="http://www.mbaobao.com/goods/search.php" method="get">
					<span>
					<select id="adv_kind">
						<option value="" selected="selected">按款式选择包包</option>
						<option value="">款式一</option>
					</select>
					</span>
					<span>
					<select id="adv_brand">
						<option value="" selected="selected">按品牌选择包包</option>
						<option value="">品牌一</option>
					</select>
					</span>
					<span>
					<select id="adv_color">
						<option value="" selected="selected">按颜色选择包包</option>
						<option value="">颜色一</option>
					</select>
					</span>
					<span>
					<select id="adv_material">
						<option value="" selected="selected">按材质选择包包</option>
						<option value="">材质一</option>
					</select>
					</span>
					<span><input type="text" id="low" class="txtinput" /> - <input type="text" id="high" class="txtinput" /> 元</span>
					<span><input type="image" src="http://wsstatic.mbaobao.com/v1/images/btn_adv_search.gif" /></span>
					</form>
				</div>
			</div>
			-->			<!-- 高级搜索 end -->

      <!-- 您浏览过的商品 start -->
      <div class="left_boxs">
        <h4>您浏览过的商品</h4>
        <ul class="viewed_products">
        </ul>
        <div class="clear"></div>
      </div>
      <!-- 您浏览过的商品 end -->





    </div>
    <div class="right_box">
      <span class="ftr gray" style="padding:19px 5px 0 0;color:#c00;">全场免运费，九百多城市货到付款</span>
      <div class="location">
        <a href="http://www.mbaobao.com/">麦包包</a>
        <span>>></span> <a href="http://www.mbaobao.com/c-1/">手袋系列</a>
        <span>>></span> <a href="http://www.mbaobao.com/c-6/">单肩/斜挎两用包</a>
        <span>>></span> <a href="http://www.mbaobao.com/pshow-1108002609.html">[DUDU]风行都市系列头层牛皮两用包 裸色</a>
      </div>


      <!-- product view start -->
      <div class="product_view">
        <div class="left" style="position:relative;">
          <div style="height:422px;">
            <%  if @pcolor.image_url %>
              <a href='<%=url_for_file_column(@pcolor,"image_url","origin")%>' class = 'cloud-zoom' id='zoom1'
                 rel="adjustX: 10, adjustY:-4">
                   <%= image_tag url_for_file_column(@pcolor,"image_url","larger"),:title=>@product.name%>
              </a>
            <%  end %>
          </div>

          <div style="padding-top:15px;height:64px;">
            <div class="left_btn"><a class="prev" style="cursor: pointer;"><img src="http://wsstatic.mbaobao.com/v1/images/arrow_left.gif" alt="" /></a></div>
            <div class="goods_image_scroll">
              <ul>
                <%  if @pcolor.image_url %>
                  <li>
                    <a href='<%=url_for_file_column(@pcolor,"image_url","origin")%>' class='cloud-zoom-gallery' title='Thumbnail 1'
                       rel="useZoom: 'zoom1', smallImage: '<%=url_for_file_column(@pcolor,"image_url","larger")%>' ">
                      <img src="<%=url_for_file_column(@pcolor,"image_url","thumb")%>" alt = "Thumbnail 1"/></a>
                  </li>
                <%  end %>

                <% if @pcolor.image_url1 %>
                  <li>
                    <a href='<%=url_for_file_column(@pcolor,"image_url1","origin")%>' class='cloud-zoom-gallery' title='Thumbnail 2'
                       rel="useZoom: 'zoom1', smallImage: '<%=url_for_file_column(@pcolor,"image_url1","larger")%>'">
                      <img src="<%=url_for_file_column(@pcolor,"image_url1","thumb")%>" alt = "Thumbnail 2"/></a>
                  </li>
                <%  end %>

                <% if @pcolor.image_url2 %>
                  <li>
                    <a href='<%=url_for_file_column(@pcolor,"image_url2","origin")%>' class='cloud-zoom-gallery' title='Thumbnail 3'
                       rel="useZoom: 'zoom1', smallImage: '<%=url_for_file_column(@pcolor,"image_url2","larger")%>'">
                      <img src="<%=url_for_file_column(@pcolor,"image_url2","thumb")%>" alt = "Thumbnail 3"/></a>
                  </li>
                <%  end %>

                <% if @pcolor.image_url3 %>
                  <li>
                    <a href='<%=url_for_file_column(@pcolor,"image_url3","origin")%>' class='cloud-zoom-gallery' title='Thumbnail 4'
                       rel="useZoom: 'zoom1', smallImage: '<%=url_for_file_column(@pcolor,"image_url3","larger")%>'">
                      <img src="<%=url_for_file_column(@pcolor,"image_url3","thumb")%>" alt = "Thumbnail 4"/></a>
                  </li>
                <%  end %>
              </ul>
            </div>
            <div class="right_btn"><a class="next" style="cursor: pointer;"><img src="http://wsstatic.mbaobao.com/v1/images/arrow_right.gif" alt="" /></a></div>
          </div>
        </div>
        <div class="right">
          <h2>[DUDU]风行都市系列头层牛皮两用包 裸色
          </h2>
          <div class="detail top">TT价：<span class="price"><%=@product.price%></span>元</div>
          <div class="detail">编号：<span class="num"><%=@product.id%></span></div>
          <div class="box">
            颜　色：
            <ul class="product_color">
              <% for pcolor in @product.pcolors %>
                <li>
                  <a href='/products/<%=@product.id%>/pcolors/<%=pcolor.id%>' >
                    <%= image_tag url_for_file_column(pcolor,"image_url","thumb")%>
                  </a>
                </li>
              <% end %>
            </ul>
            <div style="clear:both;"></div>
            <div class="buy">我要买：<input id="input_goods_buy_number" type="text" name="buy_number" size="5" value="1" />&nbsp;&nbsp;<span class="red">热销中，请尽快抢购！</span></div>
            <div style="clear:both;"></div>
          </div>
          <div class="btn">
            <a class="hand" onclick="add_goods_to_cart(11000);" rel="nofollow" style="float:left;"><img src="http://wsstatic.mbaobao.com/v1/images/btn_view_buy_new.gif" alt="立即购买" /></a>
            <a class="hand" onclick="add_goods_to_favorites(11000);" rel="nofollow" style="float:right;"><img src="http://wsstatic.mbaobao.com/v1/images/btn_view_favor_new.gif" alt="加入收藏" /></a>
            <div style="clear:both;"></div>
          </div>
          <div class="share"><a class="sinashare" href="http://v.t.sina.com.cn/share/share.php?title=[DUDU]风行都市系列头层牛皮两用包 裸色&url=http://www.mbaobao.com/pshow-1108002609.html" title="分享到新浪微博" target="_blank">分享到新浪微博</a></div>
          <div style="padding:5px 10px 10px;">
            <div class="detail" style="color:#c00;font-weight:bold;">上架时间：<%=@product.created_at%></div>					<div class="detail">出售：<span class="num">135</span> 件　收藏：<span class="num">47</span> 次</div>
            <div class="detail">浏览：<span class="num">4486</span> 次</div>
            <div class="detail bottom">评分：<img class="vam" src="http://wsstatic.mbaobao.com/v1/images/icon_star_5.gif" alt="" />&nbsp;（<a href="#goods_comment_content" onclick="return view_changed(3);">已有 0 人评论</a>）</div>
            <!---->
          </div></div>
        <div style="clear:both;"></div>
      </div>


      <!-- product view end -->

      <div style="padding-top:20px;">
        <div class="property">
          <ul>
            <% for h in @product.holds  %>
              <li><%="#{h.property.name}:#{h.value}"%></li>
            <% end %>
          </ul>
          <div style="clear:both;"></div>
        </div>
      </div>
      <a id="goods_comment_content"></a>

      <!-- 新产品详细 开始 -->
      <div class="product_detail_select_box">
        <span class="top"><a href="#page_top">回到顶部</a></span>
        <ul id="select_all">
          <li name="select_1" class="on"><a href="javascript:void(0);" onclick="view_changed(1); return false;">商品描述</a></li>
          <li name="select_2"><a href="javascript:void(0);" onclick="view_changed(2); return false;">售前咨询</a></li>
          <li name="select_3"><a href="javascript:void(0);" onclick="view_changed(3); return false;">评价详情</a></li>
          <li name="select_4"><a href="javascript:void(0);" onclick="view_changed(4); return false;">销售记录</a></li>
        </ul>
      </div>

      <div id="select_content_1" class="product_detail">
        <!-- 商品描述 start -->
        <div id="select_1" class="select_content content">
          <IMG src="http://ws01.mbbimg.cn/biaozhun/bt/zy.jpg"><table width="740" height="10582" border="0" align="center" cellpadding="0" cellspacing="0" id="Table_01">

            <tr>

              <td>

                <img src="http://ws04.mbbimg.cn/dudu/201009/02/11080026/11080026_01.jpg" width="740" height="79" alt=""></td>

            </tr>

            <tr>

              <td>

                <img src="http://ws01.mbbimg.cn/dudu/201009/02/11080026/11080026_02.jpg" width="740" height="236" alt=""></td>

            </tr>

            <tr>

              <td>

                <img src="http://ws06.mbbimg.cn/dudu/201009/02/11080026/11080026_03.jpg" width="740" height="672" alt=""></td>

            </tr>

            <tr>

              <td>

                <img src="http://ws01.mbbimg.cn/dudu/201009/02/11080026/11080026_04.jpg" width="740" height="688" alt=""></td>

            </tr>

            <tr>

              <td>

                <img src="http://ws05.mbbimg.cn/dudu/201009/02/11080026/11080026_05.jpg" width="740" height="680" alt=""></td>

            </tr>

            <tr>

              <td>

                <img src="http://ws01.mbbimg.cn/dudu/201009/02/11080026/11080026_06.jpg" width="740" height="735" alt=""></td>

            </tr>

            <tr>

              <td>

                <img src="http://ws06.mbbimg.cn/dudu/201009/02/11080026/11080026_07.jpg" width="740" height="514" alt=""></td>

            </tr>

            <tr>

              <td>

                <img src="http://ws01.mbbimg.cn/dudu/201009/02/11080026/11080026_08.jpg" width="740" height="491" alt=""></td>

            </tr>

            <tr>

              <td>

                <img src="http://ws02.mbbimg.cn/dudu/201009/02/11080026/11080026_09.jpg" width="740" height="711" alt=""></td>

            </tr>

            <tr>

              <td>

                <img src="http://ws07.mbbimg.cn/dudu/201009/02/11080026/11080026_10.jpg" width="740" height="505" alt=""></td>

            </tr>

            <tr>

              <td>

                <img src="http://ws07.mbbimg.cn/dudu/201009/02/11080026/11080026_11.jpg" width="740" height="832" alt=""></td>

            </tr>

            <tr>

              <td>

                <img src="http://ws03.mbbimg.cn/dudu/201009/02/11080026/11080026_12.jpg" width="740" height="497" alt=""></td>

            </tr>

            <tr>

              <td>

                <img src="http://ws05.mbbimg.cn/dudu/201009/02/11080026/11080026_13.jpg" width="740" height="497" alt=""></td>

            </tr>

            <tr>

              <td>

                <img src="http://ws05.mbbimg.cn/dudu/201009/02/11080026/11080026_14.jpg" width="740" height="499" alt=""></td>

            </tr>

            <tr>

              <td>

                <img src="http://ws01.mbbimg.cn/dudu/201009/02/11080026/11080026_15.jpg" width="740" height="683" alt=""></td>

            </tr>

            <tr>

              <td>

                <img src="http://ws08.mbbimg.cn/dudu/201009/02/11080026/11080026_16.jpg" width="740" height="480" alt=""></td>

            </tr>

            <tr>

              <td>

                <img src="http://ws06.mbbimg.cn/dudu/201009/02/11080026/11080026_17.jpg" width="740" height="636" alt=""></td>

            </tr>

            <tr>

              <td>

                <img src="http://ws06.mbbimg.cn/dudu/201009/02/11080026/11080026_18.jpg" width="740" height="549" alt=""></td>

            </tr>

            <tr>

              <td>

                <img src="http://ws02.mbbimg.cn/dudu/201009/02/11080026/11080026_19.jpg" width="740" height="598" alt=""></td>

            </tr>

          </table><table width="500" border="0" align="center" cellpadding="5" cellspacing="1" bgcolor="#ded9d3">

            <tr>

              <td width="52" height="17" align="left" valign="top" bgcolor="#f4f3ef">名称 </td>

              <td width="382" align="left" valign="top" bgcolor="#f4f3ef">[DUDU]风行都市系列头层牛皮两用包</td>

            </tr>

            <tr>

              <td height="17" align="left" valign="top" bgcolor="#FFFFFF">功能 </td>

              <td align="left" valign="top" bgcolor="#FFFFFF">单肩斜挎包 </td>

            </tr>

            <tr>

              <td height="17" align="left" valign="top" bgcolor="#FFFFFF">打开方式 </td>

              <td align="left" valign="top" bgcolor="#FFFFFF">拉链 </td>

            </tr>

            <tr>

              <td height="17" align="left" valign="top" bgcolor="#FFFFFF">材料 </td>

              <td align="left" valign="top" bgcolor="#FFFFFF">头层牛皮</td>

            </tr>

            <tr>

              <td height="17" align="left" valign="top" bgcolor="#FFFFFF">颜色 </td>

              <td align="left" valign="top" bgcolor="#FFFFFF">灰色、裸色、红色</td>

            </tr>

            <tr>

              <td height="17" align="left" valign="top" bgcolor="#FFFFFF">尺寸 </td>

              <td align="left" valign="top" bgcolor="#FFFFFF">包体宽：36cm（以产品最宽处测量），高：30cm，厚：14cm，肩带高约：21cm（可调节），斜挎带长约：113cm（可调节可拆卸）</td>

            </tr>

            <tr>

              <td height="17" align="left" valign="top" bgcolor="#FFFFFF">内部结构 </td>

              <td align="left" valign="top" bgcolor="#FFFFFF">3个外袋，1个内拉链袋，1个手机袋，1个证件袋，1个拉链夹层袋，1个夹层，1个钥匙扣</td>

            </tr>

            <tr>

              <td height="17" align="left" valign="top" bgcolor="#FFFFFF">产地 </td>

              <td align="left" valign="top" bgcolor="#FFFFFF">中国 </td>

            </tr>

            <tr>

              <td height="17" align="left" valign="top" bgcolor="#FFFFFF">重量 </td>

              <td align="left" valign="top" bgcolor="#FFFFFF">0.92KG </td>

            </tr>

            <tr>

              <td height="17" align="left" valign="top" bgcolor="#FFFFFF">市场价 </td>

              <td align="left" valign="top" bgcolor="#FFFFFF">729元 </td>

            </tr>

            <tr>

              <td height="17" align="left" valign="top" bgcolor="#FFFFFF">实物点评 </td>

              <td align="left" valign="top" bgcolor="#FFFFFF">图片仅做款式参考，产品说明为您了解此包的辅助说明，请以实物为准。 </td>

            </tr>

          </table>
        </div>
        <!-- 商品描述 end -->
      </div>

      <!-- start 2 -->
      <div id="select_bar_2">
        <div class="tar" style="padding-top:15px;"><a class="hand" onclick="add_goods_to_cart(11000);" rel="nofollow"><img src="http://wsstatic.mbaobao.com/v1/images/btn_view_buy_new.gif" alt="立即购买" /></a></div>				<div class="product_detail_select_box" style="margin-top:0;">
          <span class="top"><a href="#page_top">回到顶部</a></span>
          <ul>
            <li class="on_2"><a href="javascript:void(0);" onclick="return false;">售前咨询</a></li>
          </ul>
        </div>
      </div>

      <div id="select_content_2" class="product_detail">
        <!-- 售前咨询 start -->
        <div id="select_2" class="select_content comment_detail" style="display: ">
          <div class="title">如购买过程中有任何疑问，欢迎向我们咨询&nbsp;&nbsp;&nbsp;点击 <a href="#add_consultation">发表咨询</a></div>
          <div id="goods_consultation_list"><p class="tac">正在读取咨询数据...</p></div>
          <a id="add_consultation"></a>
          <div class="write_comment">
            <h2 class="right_module">发表咨询 <span style="font-weight:normal;">(如购买过程中有任何疑问，欢迎向我们咨询)</span></h2>
            <div class="right_module">
              <table width="100%" border="0" cellspacing="5" cellpadding="5">
                <tr>
                  <td>验证字符：</td>
                  <td><input type="text" class="txtinput vam" id="input_consultation_verifycode" name="verifycode" size="4" maxlength="4" />&nbsp;<img id="img_consultation_verifycode" src="http://www.mbaobao.com/templates/default/images/space.gif" onclick="change_verifycode(this);" style="vertical-align:middle;cursor:pointer;" title="" alt="" /></td>
                </tr>
                <tr>
                  <td width="60" valign="top">咨询内容：</td>
                  <td width="*"><textarea id="textarea_consultation_content" style="height:60px;width:500px;" class="txtinput"></textarea></td>
                </tr>
                <tr>
                  <td>&nbsp;</td>
                  <td><input type="image" src="http://wsstatic.mbaobao.com/v1/images/btn_add_consultation_2.gif" onclick="add_goods_consultation();" style="border:0;" /></td>
                </tr>
              </table>
            </div>
          </div>
        </div>
        <!-- 售前咨询 end -->
      </div>
      <!-- end 2 -->

      <!-- start 3 -->
      <div id="select_bar_3" class="product_detail_select_box">
        <span class="top"><a href="#page_top">回到顶部</a></span>
        <ul>
          <li class="on_2"><a href="javascript:void(0);" onclick="return false;">评价详情</a></li>
        </ul>
      </div>
      <div id="select_content_3" class="product_detail">
        <!-- 购买心得 start -->
        <div id="select_3" class="select_content comment_detail" style="display: ">
          <!---->
          <div id="goods_comment_list"><div class="right_module"><p class="tac">正在读取评论数据...</p></div></div>
        </div>
        <!-- 购买心得 end -->
      </div>
      <!-- end 3 -->

      <!-- start 4 -->
      <div id="select_bar_4" class="product_detail_select_box">
        <span class="top"><a href="#page_top">回到顶部</a></span>
        <ul>
          <li class="on_2"><a href="javascript:void(0);" onclick="return false;">销售记录</a></li>
        </ul>
      </div>
      <div id="select_content_4" class="product_detail">
        <!-- 销售记录 start -->
        <a id="goods_sale_list_content"></a>
        <div id="select_4" class="select_content sale_record_form" style="display: ">
          <div id="goods_sale_list"><p class="tac">正在读取销售记录...</p></div>
        </div>
        <!-- 销售记录 end -->
      </div>
      <!-- end 4 -->

      <div class="tar" style="padding-top:15px;"><a class="hand" onclick="add_goods_to_cart(11000);" rel="nofollow"><img src="http://wsstatic.mbaobao.com/v1/images/btn_view_buy_new.gif" alt="立即购买" /></a></div>


    </div>
    <div style="clear:both;"></div>
  </div>
  <!-- list_main end -->
</div>



<%  if @pcolor.image_url %>
  <a href='<%=url_for_file_column(@pcolor,"image_url","origin")%>' class = 'cloud-zoom' id='zoom1'
     rel="adjustX: 10, adjustY:-4">
       <%= image_tag url_for_file_column(@pcolor,"image_url","larger"),:title=>@product.name%>
  </a>

  <a href='<%=url_for_file_column(@pcolor,"image_url","origin")%>' class='cloud-zoom-gallery' title='Thumbnail 1'
     rel="useZoom: 'zoom1', smallImage: '<%=url_for_file_column(@pcolor,"image_url","larger")%>' ">
    <img src="<%=url_for_file_column(@pcolor,"image_url","thumb")%>" alt = "Thumbnail 1"/></a>
<%  end %>

<% if @pcolor.image_url1 %>
  <a href='<%=url_for_file_column(@pcolor,"image_url1","origin")%>' class='cloud-zoom-gallery' title='Thumbnail 2'
     rel="useZoom: 'zoom1', smallImage: '<%=url_for_file_column(@pcolor,"image_url1","larger")%>'">
    <img src="<%=url_for_file_column(@pcolor,"image_url1","thumb")%>" alt = "Thumbnail 2"/></a>
<%  end %>


<div>
  <%= link_to '编辑', [@product,@pcolor] %> |
  <%= link_to '后退', product_pcolors_path(@product) %>
</div>


<p id="ad">
  <span>
    颜色列表
    <% for pcolor in @product.pcolors %>
      <a href='/products/<%=@product.id%>/pcolors/<%=pcolor.id%>' >
        <%= image_tag url_for_file_column(pcolor,"image_url","thumb")%>
      </a>
    <% end %>
  </span>
</p>



